<template>
    <div class="contion">
        <div class="success_1">
            <span><b>您的付款已完成</b></span>
            <span><b>支付成功</b></span>
        </div>
        <div class="success_2">
            <span>感谢您的购物</span>
            <router-link to="/orderdeta" style="color:red;margin-top:20px">查看订单详情</router-link>
        </div>
        <div class="pay_4">
            <el-button @click="home">返回首页</el-button>
        </div>
    </div>
</template>

<script setup>
import {ref,onMounted} from "vue"
import {ElMessage} from 'element-plus'
import {useRouter} from 'vue-router'
import http from "../http"

const router = useRouter()

const paysuccess = () =>{
    http.post(`/success/${location.search}`).then(res=>{
        console.log(res)
    })
}
const home = () =>{
    router.push('/home')
}

onMounted(()=>{
    paysuccess()
})
</script>

<style scoped>
.contion{
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    vertical-align: middle;
}

.success_1{
    display: flex;
    flex-direction: column;
    align-items: center;
    font-size: 30px;
    margin-top: 100px;
}

.success_2{
    display: flex;
    flex-direction: column;
    align-items: center;
    margin-top: 20px;
}

.pay_4 button{
    margin-top: 200px;
    width: 300px;
    height: 60px;
    border: 1px solid #E44F32;
    background-color: #E44F32;
    font-size: 20px;
    color:#FFFFFF;
    border-radius: 15px;
    margin-bottom: 40px;
}
</style>